interface FrameData {
  opacity?: number;
  scale?: number;
  rotate?: number;
  translateX?: number;
  translateY?: number;
}

class Animation {
  private currentFrame: FrameData; // 当前关键帧
  private animationQueue: FrameData[]; // 动画队列

  constructor() {
    this.currentFrame = {};
    this.animationQueue = [];
  }

  /**
   * 添加 opacity 关键帧
   * @param value opacity 的值
   * @returns Animation 实例
   */
  public opacity(value: number): Animation {
    this.currentFrame.opacity = value;
    return this;
  }

  /**
   * 添加 scale 关键帧
   * @param value scale 的值
   * @returns Animation 实例
   */
  public scale(value: number): Animation {
    this.currentFrame.scale = value;
    return this;
  }

  /**
   * 添加 rotate 关键帧
   * @param value rotate 的值
   * @returns Animation 实例
   */
  public rotate(value: number): Animation {
    this.currentFrame.rotate = value;
    return this;
  }

  /**
   * 添加 translate 关键帧
   * @param x translateX 的值
   * @param y translateY 的值
   * @returns Animation 实例
   */
  public translate(x: number, y: number): Animation {
    this.currentFrame.translateX = x;
    this.currentFrame.translateY = y;
    return this;
  }

  /**
   * 执行一些其他逻辑，例如添加缓动效果、计算关键帧等
   */
  public step(): void {
    this.animationQueue.push({ ...this.currentFrame });
    this.currentFrame = {};
  }

  /**
   * 导出动画队列
   * @returns FrameData[] 动画队列的副本
   */
  public export(): FrameData[] {
    return [...this.animationQueue];
  }
}

export default Animation;
